<#include 'layout/template.ftl'/>
<@htmlHead title='创建楼层'>

</@htmlHead>
<style>
#item{
 border: 1px solid gray;
 height: 670px;
 overflow-y:auto;
}
.itemComment{
margin-top: 10px;
 border: 1px dotted gray;
}
.floorItemList{
 border: 3px dotted red;
 height: 605px;
 overflow-y:auto;
 margin-top:10px;
}
#addfloorButton{
 border: 3px dotted red;
 border-top:none;
 height: 50px;
}
img{
	width: 200px;
	height: 200px;
	border:1 solid red;
}

.head span{
	color: red;
}
.number{
	font-size:30px;
}
.remove-btn {
	background-color:gray;
	float: right;
}
</style>
<@htmlBody 'floor'  'pcFloor'   >
	
	<#include 'layout/breadcrumbs.ftl'>
	<@breadcrumbs '管理'   '新增'></@breadcrumbs>
	
	<!-- page-content begin -->
	<div class="page-content">
			
		<!-- page-header begin -->
		<div class="page-header">
				<h1>
					新增
				</h1>
		</div>
		<!-- page-header end -->

		<!-- page-body begin -->
		<div class="row">	
			<div class="col-md-6 col-md-offset-3">
				
				<!-- 表单开始 -->
				<form class="form-horizontal" id="validation-form" method="post" action="${path}/manage/floor/pcFloor/create" >
						<input type="hidden" id ="flag"  value="1"/>
						<div class="form-group">
							<label class="control-label col-md-2">标题:</label>
							<div class="col-md-10">
								<div class="clearfix">
									<input type="text" class="form-control"  name="name"  id="name" value="${ pcFloor.name  }" />
								</div>
							</div>
						</div>
						<div class="form-group">
							<label class="control-label col-md-2">排序:</label>
							<div class="col-md-10">
								<div class="clearfix">
									<input type="text" class="form-control"  name="sortno"  id="sortno" value="${ pcFloor.sortno  }" />
								</div>
							</div>
						</div>
						<div class="form-group">
							<label class="control-label col-md-2">楼层详情:</label>
							<div  class="col-md-10">
								<div id="item">
									<div id="floorItem" class="col-md-12">
										<div id="floorItemList0" class="col-md-12 floorItemList">
											<div class="head">
												<span class="number">1</span>
												<span onclick="removeItem(0)" class="remove-btn"><i  class="glyphicon glyphicon-remove"></i>移除</span>
											</div>
										 	<select disabled="disabled" id="floorItemType0" onchange="addType(0)" style="margin-top: 10px;" class="form-control col-md-12 clearfix">
												<option value="-1">请选择详情类型</option>
												<option selected="selected" value="0">商品</option>
												<option value="1">其他</option>
											</select> 
											<div id="itemComment0"  class="col-md-12 clearfix itemComment">
												<div style="margin-top: 5px;" class="form-group">
													<label class="control-label col-md-2" for="name">父分类:</label>
													<div class="col-md-10">
														<div class="clearfix" style="position: relative">
															<select id="prizeParent0" onchange="changeParent(0)" class="form-control"
																data-live-search="true" name="courseTutor.id">
																<option value="-1">请选择商品父分类</option> 
																<#list voList as vo>
																	<option  value="${vo.parent.id}">${vo.parent.name}</option>
																</#list>
															</select> 
														</div>
													</div>
												</div>
												<div style="margin-top: 5px;" class="form-group">
													<label class="control-label col-md-2" for="name">子分类:</label>
													<div class="col-md-10">
														<div class="clearfix" style="position: relative">
															<select id="prizechild0" onchange="changeChild(0)" class="form-control"
																data-live-search="true" name="">
																<option value="-1">请选择商品子分类</option> 
															</select> 
														</div>
													</div>
												</div>
												<div style="margin-top: 5px;" class="form-group">
													<label class="control-label col-md-2" for="name">商品:</label>
													<div class="col-md-10">
														<div class="clearfix" style="position: relative">
															<select id="prize0" onchange="changeprize(0)" class="form-control"
																data-live-search="true" name="">
																<option value="-1">请选择商品</option> 
																<#list goodsList as  goods>
																	<option value="${goods.id}">${goods.name}</option> 
																</#list>
															</select> 
															<input id="goodsid0" type="hidden" value="" name ="pcfloorList[0].goods.id">
														</div>
													</div>
												</div>
												<div style="margin-top: 5px;" class="form-group">
													<label class="control-label col-md-2" for="name">标题:</label>
													<div class="col-md-10">
														<div class="clearfix" style="position: relative">
															<input class="form-control" value="" name="pcfloorList[0].name" id ="prizename0">
														</div>
													</div>
												</div>
												<div style="margin-top: 5px;" class="form-group">
													<label class="control-label col-md-2" for="name">链接:</label>
													<div class="col-md-10">
														<div class="clearfix" style="position: relative">
															<input class="form-control" value="" name="pcfloorList[0].linkurl" id ="prizelink0">
														</div>
													</div>
												</div>
												<div style="margin-top: 5px;" class="form-group">
													<label class="control-label col-md-2" for="name">logo:</label>
													<div class="col-md-10">
														<div class="clearfix" style="position: relative">
															<img  id="prizeimg0">
														 	<input type="hidden" value="" name="pcfloorList[0].picurl" id ="prizeimgurl0">
														</div>
													</div>
												</div>
											</div>
										</div>
									</div>
									<div  class="col-md-12 center">
										<div id="addfloorButton" class="col-md-12">
											<button id="addButton" type="button" class="btn btn-warning">
												<i class="glyphicon glyphicon-plus align-top bigger-125"></i>继续添加
											</button>
										</div>
									</div>
								</div>
							</div> 
						</div>
						
				</form>
				 	<div class="col-md-12 center">
                   		<button id="form-submit" type="button" onclick="mysubmit('validation-form')"  class="btn btn-primary">
										<i class="fa fa-save align-top bigger-125"></i>保存
						</button>
						<button type="reset" class="btn" onclick="history.go(-1)">
							<i class="fa fa-pencil align-top bigger-125"></i>返回上一页
						</button>
					</div> 
				<!-- 表单结束 -->
			</div>
		</div>
		<!-- page-body end -->
		
	</div>		
	<!-- page-content end -->
	
</@htmlBody>

<@htmlBodyScript>
<script type="text/javascript">
var list = '${voListJson}';
var obj = JSON.parse(list);
var volist = obj.volist;
var goodlist = '${goodsvoList}';
var goodobj = JSON.parse(goodlist);
var goodvolist = goodobj.goodsList;
var floorUrl = '${floorUrl1}';
</script>
<link rel="stylesheet" href="${resources}/css/bootstrap-select.css" />
<script src="${resources}/js/bootstrap-select.js"></script>
<script src="${resources}/js/floor.js"></script>
	<script type="text/javascript">
	function mysubmit(form){
 		$("#"+form).submit();
 	}
	  	$(function(){
	  	　　　　//启动Bootsrap-Select
	  		$("#prizeParent0").selectpicker({
	  	　　　　　　dropuAuto : false,
	  	      	size:4,
	  	    	noneResultsText:'没有找到要查找的{0}',
	  	        liveSearch: true
	  	　　　　}); 
	  		$("#prizechild0").selectpicker({
	  	　　　　　　dropuAuto : false,
	  	      	size:4,
	  	    	noneResultsText:'没有找到要查找的{0}',
	  	        liveSearch: true
	  	　　　　}); 
	  		$("#prize0").selectpicker({
	  	　　　　　　dropuAuto : false,
	  	      	size:4,
	  	    	noneResultsText:'没有找到要查找的{0}',
	  	        liveSearch: true
	  	　　　　}); 
	  	});
	</script>
	<!-- 验证框架 -->	
	<script src="${resources}/plugins/jquery-validation/jquery.validate.min.js"></script>
	<script src="${resources}}/plugins/jquery-validation/messages_zh.min.js"></script>
	<script type="text/javascript">
			jQuery.validator.addMethod("isName", function(value, element) {       
	 			var corpName =  /^[\u0391-\uFFE5\w\-\s\.]{1,50}$/;
  				 return this.optional(element) || corpName.test(value);       
 			}, "请使用汉字、英文字母、数字、下划线、减号、空格或点");   
 			
	
			$('#validation-form').validate({
				errorElement: 'div',
				errorClass: 'help-block',
				focusInvalid: false,
				rules: {
					id: {
						required:true
					},
					name: {
						required:true
					},
					seq: {
						required:true
					},
					corpId: {
						required:true
					},
					status: {
						required:true
					},
					creator: {
						required:true
					},
					createTime: {
						required:true
					}
				},
		
				messages: {
				},
		
		
				highlight: function (e) {
					$(e).closest('.form-group').removeClass('has-info').addClass('has-error');
				},
		
				success: function (e) {
					$(e).closest('.form-group').removeClass('has-error');//.addClass('has-info');
					$(e).remove();
				},
		
				errorPlacement: function (error, element) {
					if(element.is('input[type=checkbox]') || element.is('input[type=radio]')) {
						var controls = element.closest('div[class*="col-"]');
						if(controls.find(':checkbox,:radio').length > 1) controls.append(error);
						else error.insertAfter(element.nextAll('.lbl:eq(0)').eq(0));
					}
					else if(element.is('.select2')) {
						error.insertAfter(element.siblings('[class*="select2-container"]:eq(0)'));
					}
					else if(element.is('.chosen-select')) {
						error.insertAfter(element.siblings('[class*="chosen-container"]:eq(0)'));
					}
					else error.insertAfter(element.parent());
				},
		
				submitHandler: function (form) {
					
					form.submit();
				},
				invalidHandler: function (form) {
				}
			});
	</script>
	
</@htmlBodyScript>	


